<template>
    <div>
        <Card dis-hover :bordered="false" class="ivu-mt">
            <jgsearch :searchData="searchData" @on-enter="askDatasearch" @on-clear="askDatasearch"
                      @on-change-change="askDatachanges" @on-change-changetime="askDatachangestime"
                      @on-change-changeAlias="changeAlias">
                <template v-slot:timeButton>
                    <div v-if="booltimeButton">
                        <Button @click="timeButtons(10)" :type="timeButton==10?'primary':'default'" :ghost="timeButton==10" class="ivu-mr-8">近10天</Button>
                        <Button @click="timeButtons(30)" :type="timeButton==30?'primary':'default'" :ghost="timeButton==30" class="ivu-mr-8">近30天</Button>
                        <Button @click="timeButtons(90)" :type="timeButton==90?'primary':'default'" :ghost="timeButton==90">近90天</Button>
                    </div>
                </template>
                <template v-slot:checkbox>
                    <div style="display: flex;align-items: center;justify-content: center;">
                        <CheckboxGroup @on-change="checkbox3">
                            <Checkbox label="重复"></Checkbox>
                        </CheckboxGroup>
                        <CheckboxGroup v-if="ceshiButton" @on-change="checkbox5">
                            <Checkbox label="测试"></Checkbox>
                        </CheckboxGroup>
                    </div>
                </template>
            </jgsearch>
            <Table highlight-row ref="table" :columns="columns" :max-height="600" :data="list" :loading="loading"
                   size="small">
                <template slot-scope="{ row }" slot="called_tel">
                    <a @click="handleContactClue(row)">{{ row.called_tel }}</a>
                </template>
                <template slot-scope="{ row }" slot="clueState">
                    <div v-if="row.status_name">
                        <Tag v-if="+row.clue_status_id === 7" color="primary">{{
                            row.status_name
                        }}</Tag>
                        <Tag v-else-if="+row.clue_status_id === 8" color="success">{{ row.status_name }}</Tag>
                        <Tag v-else-if="+row.clue_status_id === 6" color="default">{{ row.status_name }}</Tag>
                        <Tag v-else-if="+row.clue_status_id === 9" color="warning">{{ row.status_name }}</Tag>
                        <Tag v-else>{{ row.status_name }}</Tag>
                    </div>
                </template>
                <template slot-scope="{ row }" slot="callState">
                    <Badge v-if="row.is_call_str === '未接听'" status="warning" text="未接听" ></Badge>
                    <Badge v-if="row.is_call_str === '已接听'" status="success" text="已接听" ></Badge>
                </template>
                <template slot-scope="{ row }" slot="operation">
                    <a v-hasC="{
                        name: 'clue-call-contact',
                        flag: 'v1/clue/call/contact',
                    }" v-if="+row.clue_status_id !== 8" @click="handleContactClue(row)">联系</a>
                    <span v-else class="person">{{ row.realname }}</span>
                    <Divider type="vertical"></Divider>
                    <a @click="handleSound(row)">听录音</a>
                    <Divider v-if="row.repeat_type === '1'" v-hasC="{
                        name: 'v1-patient-index-repeat-list7',
                        flag: 'v1/patient/index/repeat-list',
                    }" type="vertical"></Divider>
                    <a v-if="row.repeat_type === '1'" v-hasC="{
                        name: 'v1-patient-index-repeat-list7',
                        flag: 'v1/patient/index/repeat-list',
                    }" @click="repeatData(row)">重复</a>
                </template>
            </Table>
            <div class="ivu-mt ivu-text-center">
                <Page show-total show-elevator show-sizer :total="total" :current.sync="params.page"
                      :page-size="params.pageSize" :page-size-opts="pageOpts" @on-change="changepage"
                      @on-page-size-change="changepageSize" ></Page>
            </div>
        </Card>
        <Modal title="听录音" v-model="sound" :mask-closable="false" width="360" footer-hide @on-cancel="cancel">
            <audio :src="musicurl" controls id="audio" v-if="musicurl != ''"></audio>
            <div v-else>暂无录音</div>
            <div v-if="musicurl != ''" style="margin-top: 10px;">
                播放倍速：
                <RadioGroup v-model="model1" @on-change="changeaudio(model1)">
                    <Radio :label="item.id" v-for="item in RadioGroup" :key="item.id">{{ item.name }}</Radio>
                </RadioGroup>
            </div>
        </Modal>
        <Modal ref="contact" title="联系线索客户" v-model="contactClue" :mask-closable="false" width="1000"
               @on-cancel="handleDrawerCancel('formItem')">
            <DescriptionList :col="3" v-if="createData">
                <Description term="手机号：">{{createData.mobile}}</Description>
                <Description term="性别：">{{createData.gender}}</Description>
                <Description term="年龄：">{{createData.age}}</Description>
                <Description term="微信号：">{{createData.wechat_id}}<Tag class="ivu-ml-8" v-if="createData.is_add" color="success">已添加</Tag></Description>
                <Description term="部位：">{{createData.parts_name}}</Description>
                <Description term="城市：">{{createData.city_name}}</Description>
                <Description term="客服备注：">{{createData.customer_remark}}</Description>
                <!-- <Description term="来电号码：">{{ createData.called_tel }}</Description>
                <Description term="来电时间：">{{ createData.call_time }}</Description>
                <Description term="来电状态：">{{ createData.is_call_str }}</Description>
                <Description term="通话时长：">{{ createData.duration_str }}</Description> -->
            </DescriptionList>
            <Divider></Divider>
            <Form label-position="top" :model="params1" ref="formItem" :rules="createRuless">
                <Row>
                    <Col span="8">
                    <FormItem label="联系结果" v-if="contactshow">
                        <RadioGroup v-model="params1.clue_status_id" @on-change="changeclue">
                            <Radio :label="item.value" v-for="item in clueList" :key="item.value"
                                   v-if="+item.value !== 9&&+item.value !== 7"><span>{{ item.label }}</span></Radio>
                        </RadioGroup>
                    </FormItem>
                    <FormItem label="联系方式" v-if="params1.clue_status_id == 7" prop="contact_type">
                        <RadioGroup v-model="params1.contact_type">
                            <Radio :label="1"><span>微信</span></Radio>
                            <Radio :label="2"><span>电话</span></Radio>
                            <Radio :label="3"><span>其他</span></Radio>
                        </RadioGroup>
                    </FormItem>
                    <Timeline style="max-height: 380px; overflow: auto;" v-if="contact.length">
                        <TimelineItem v-for="item in contact" :key="item.id">
                            <p class="time ivu-mb-8">{{ item.created_at }}</p>
                            <p class="content ivu-mb-8">{{ item.remark }}</p>
                            <p class="consultant ivu-mb-8">
                                <span class="c-inr ivu-mr-8">{{
                                    item.realname
                                }}</span>
                                <Badge v-if="item.status_name === '未联系上'" status="success" :text="item.status_name" ></Badge>
                                <Badge v-if="item.status_name === '无效'" status="processing" :text="item.status_name" ></Badge>
                                <Badge v-if="item.status_name === '转客户'" status="warning" :text="item.status_name" ></Badge>
                                <Badge v-if="item.status_name === '新数据'" status="default" :text="item.status_name" ></Badge>
                            </p>
                        </TimelineItem>
                    </Timeline>
                    </Col>
                    <Col span="16" v-if="contactshow">
                    <template v-if="params1.clue_status_id === '8'">
                        <Row :gutter="24">
                            <Col span="5">
                            <FormItem label="姓名">
                                <Input v-model="params1.userName" placeholder="请输入姓名" ></Input>
                            </FormItem>
                            </Col>
                            <Col span="6">
                            <FormItem label="性别">
                                <RadioGroup v-model="params1.sex">
                                    <Radio :label="0">未知</Radio>
                                    <Radio :label="1">男</Radio>
                                    <Radio :label="2">女</Radio>
                                </RadioGroup>
                            </FormItem>
                            </Col>
                            <Col span="4">
                            <FormItem label="年龄" prop="age">
                                <InputNumber :max="100" :min="1" v-model="params1.age"></InputNumber>
                            </FormItem>
                            </Col>
                            <Col span="9">
                            <FormItem label="城市" required>
                                <jgcheckcity ref="checkcity" v-if="cityshow" @cityvalue="cityvalue" v-model="city_id" :name="`call`"></jgcheckcity>
                            </FormItem>
                            </Col>
                        </Row>
                        <Row :gutter="24">
                            <Col span="8">
                            <FormItem label="手机号" prop="mobile">
                                <Input v-model="params1.mobile" @on-keyup="params1.mobile=params1.mobile.replace(/\s+|[\r\n]/g,'')" @on-blur="telrepeat(params1.mobile)"
                                       placeholder="请输入手机号" ></Input>
                                <div style="color:#ff9900;font-size:18px" v-if="patientStatus">！老患者到诊</div>
                            </FormItem>
                            </Col>
                            <Col span="8">
                            <FormItem label="微信号">
                                <Input v-model="params1.weChartNum" @on-keyup="params1.weChartNum=params1.weChartNum.replace(/\s+|[\r\n]/g,'')" @on-blur="WXrepeat(params1.weChartNum)"
                                       placeholder="请输入微信号" ></Input>
                            </FormItem>
                            </Col>
                        </Row>
                        <Row :gutter="24">
                            <Col span="8">
                            <FormItem label="一级病种" prop="oneDiseases">
                                <Select placeholder="请选择一级病种" v-model="params1.oneDiseases" clearable
                                        :key="Math.random() * 10 + 1" @on-clear="clearOne" @on-change="changeOne">
                                    <Option v-for="item in diseasesArr1" :value="item.value" :key="item.value">{{
                                    item.label }}</Option>
                                </Select>
                            </FormItem>
                            </Col>
                            <Col span="8">
                            <FormItem label="二级病种" :key="Math.random() * 10 + 1" prop="twoDiseases" :rules="twoRules"
                                      v-show="diseasesArr2.length>0">
                                <Select placeholder="请选择二级病种" v-model="params1.twoDiseases" clearable>
                                    <Option v-for="item in diseasesArr2" :value="item.value" :key="item.value">{{
                                    item.label }}</Option>
                                </Select>
                            </FormItem>
                            </Col>
                            <Col span="8">
                            <FormItem label="患者状态" prop="patientStatus">
                                <Select placeholder="请选择" v-model="params1.patientStatus" clearable>
                                    <Option v-for="item in patientStatusArr" :value="item.value" :disabled="
                                        +item.is_select === 0
                                    " :key="item.value">{{ item.label }}</Option>
                                </Select>
                            </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span="12">
                            <FormItem label="部位" prop="bodyPart" :rules="bodyPartRule">
                                <TreeSelect :max-tag-count="2" v-model="params1.bodyPart" :data="postList" clearable
                                            multiple ></TreeSelect>
                            </FormItem>
                            </Col>
                        </Row>
                        <template v-if="
                            +params1.patientStatus === 2 ||
                                +params1.patientStatus === 1
                        ">
                            <FormItem label="下次回访时间" prop="day">
                                <Row :gutter="16">
                                    <Col span="6">
                                    <InputNumber :formatter="$inputday" :step="1" :min="0" v-model.number="params1.day"
                                                 @on-change="
                                                     blurday(params1.day)
                                                 ">
                                    </InputNumber>
                                    </Col>
                                    <Col span="4">天后</Col>
                                    <Col span="12">
                                    <DatePicker :editable="false" :options="optionss" type="date" v-model="DatePicker"
                                                @on-change="
                                                    changeday(DatePicker)
                                                " placeholder="请输入回访时间">
                                    </DatePicker>
                                    </Col>
                                </Row>
                            </FormItem>
                        </template>
                        <template v-if="+params1.patientStatus === 1">
                            <FormItem label="预到时间" prop="day1">
                                <Row :gutter="16">
                                    <Col span="6">
                                    <InputNumber :formatter="$inputday" :step="1" :min="0" v-model.number="params1.day1"
                                                 @on-change="
                                                     blurday1(params1.day1)
                                                 ">
                                    </InputNumber>
                                    </Col>
                                    <Col span="4">天后</Col>
                                    <Col span="12">
                                    <DatePicker :editable="false" :options="optionss" type="date" v-model="DatePicker1"
                                                @on-change="
                                                    changeday1(DatePicker1)
                                                " placeholder="请输入预到时间">
                                    </DatePicker>
                                    </Col>
                                </Row>
                            </FormItem>
                        </template>
                    </template>
                    <FormItem label="备注" prop="remark" :rules="remarkRule">
                        <Input type="textarea" placeholder="请备注原因" v-model="params1.remark"
                               :autosize="{ minRows: 2, maxRows: 8 }" ></Input>
                    </FormItem>
                    </Col>
                </Row>
            </Form>

            <div slot="footer">
                <Button @click="handleDrawerCancel('formItem')">取消</Button>
                <Button type="primary" :loading="remarksloading" @click="handlesearch('formItem')">确定</Button>
            </div>
        </Modal>
        <Modal title="重复数据" :mask-closable="false" footer-hide :width="80" v-model="repeatDatas">
            <Table :max-height="400" :columns="repeatColumns" :data="repeatDataList" :loading="callloading">
                <template slot="mobile" slot-scope="{ row }">
                    <span v-if="+repeatInfo.repeat_type === 1" :class="
                        row.mobile && row.mobile === repeatInfo.mobile
                            ? 'repeatColor'
                            : null
                    ">
                        {{ row.mobile }}
                    </span>
                    <span v-else>{{ row.mobile }}</span>
                </template>
            </Table>
        </Modal>
    </div>
</template>
<script>
    import jgsearch from '@/components/search';
    // import jgcheckcity from '@/components/checkcity';
    import {
        cluecallselectinfo,
        cluecalllist,
        cluecallcontact,
        getCluecallcontact
    } from '@api/hqapi/indexone';
    import {
        patientindexsearchcity, repeatCallData,
        patientindexsearchmobile,
        repeatbaiyou
    } from '@api/hqapi';
    import dayjs from 'dayjs';
    let lodash = require('lodash');

    export default {
        name: 'call',
        components: { jgsearch },
        props: {
            booltimeButton: { type: Boolean, default: true },
            clue_status_id: { type: [String, Number], default: '' },
            ceshiButton: { type: Boolean, default: false },
            columnsHeader: { type: [String, Number], default: 0 },
            customer: { type: Boolean, default: false }
        },
        data() {
            const validateMobile = (rule, value, callback) => {
                if(value === '') {
                    callback();
                }else {
                    let reg = /^\d{10,12}$/;
                    if(reg.test(value)) {
                        callback();
                    }else {
                        callback(new Error('请输入正确的联系号码'));
                    }
                }
            };
            return {
                contactshow: true,
                timeButton: 10,
                firstTime: true,
                city_id: [],
                cityshow: true,
                optionscity: [],
                callloading: false,
                repeatDatas: false,
                edit: false,
                device: [],
                loading: false,
                loadingcity: false,
                repeatColumns: Object.freeze([
                    {
                        title: '设备别名',
                        key: 'wechatid',
                        width: 180
                    },
                    {
                        title: '归属部门',
                        key: 'department_name'
                    },
                    {
                        title: '来电号码',
                        slot: 'mobile'
                    },
                    {
                        title: '通话时长',
                        key: 'duration_str'
                    },
                    {
                        title: '线索状态',
                        key: 'status_name'
                    },
                    {
                        title: '来电时间',
                        key: 'call_time'
                    }
                ]),
                postList: [],
                createRuless: {
                    contact_type: [
                        {
                            required: true,
                            message: '请选中联系方式'
                        }
                    ],
                    remark: [
                        {
                            required: true,
                            type: 'string',
                            message: '请输入备注原因',
                            trigger: 'blur'
                        }
                    ],
                    mobile: [{ validator: validateMobile, trigger: 'blur' }],

                    city: [
                        {
                            required: true,
                            message: '请选择城市',
                            trigger: 'change'
                        }
                    ],
                    age: [
                        {
                            required: true,
                            message: '请填写年龄',
                            type: 'number',
                            trigger: 'blur,change'
                        }
                    ],
                    oneDiseases: [
                        {
                            required: true,
                            message: '请选择一级病种',
                            trigger: 'change'
                        }
                    ],
                    twoDiseases: [
                        {
                            required: true,
                            message: '请选择二级病种',
                            trigger: 'change'
                        }
                    ],
                    patientStatus: [
                        {
                            required: true,
                            message: '请选择患者状态',
                            trigger: 'change'
                        }
                    ],
                    day: [
                        {
                            required: true,
                            type: 'number',
                            message: '请输入回访时间',
                            trigger: 'blur'
                        }
                    ],
                    day1: [
                        {
                            required: true,
                            type: 'number',
                            message: '请输入预约',
                            trigger: 'blur'
                        }
                    ]
                },
                dateDay: ['2020-05-01', '2020-05-01'],
                list: [],
                selectedData: [],
                current: 1,
                size: 10,
                showCreate: false,
                creating: true,
                remarksloading: false,
                updateIndex: -1,
                contactClue: false,
                sound: false,
                diseasesArr1: [],
                diseasesArr2: [],
                createData: {
                    gender: '',
                    age: 0,
                    wechat_id: '',
                    parts_name: '',
                    city_name: '',
                    mobile: '',
                    customer_remark: '',
                    is_add: false
                },
                columns: [
                    { title: '来电号码', fixed: 'left', slot: 'called_tel', width: 120 },
                    { title: '归属部门', key: 'department_name', width: 100 },
                    {
                        title: '设备别名',
                        key: 'device_name',
                        width: 130
                    },
                    { title: '通话时长', key: 'duration_str', width: 100 },
                    { title: '来电时间', key: 'call_time', width: 168 },
                    { title: '来电状态', slot: 'callState', width: 100 },
                    { title: '处理时间', key: 'deal_time', width: 150 },
                    {
                        title: '联系人员',
                        key: 'operation_name',
                        minWidth: 120,
                        ellipsis: true,
                        tooltip: true
                    },
                    { title: '备注', key: 'customer_remark', minWidth: 150 },
                    {
                        title: '操作',
                        key: 'operation',
                        slot: 'operation',
                        fixed: 'right',
                        width: 180
                    }
                ],
                contact: [],
                searchData: {
                    project: [
                        {
                            id: 1,
                            key: 'Input',
                            clearable: true,
                            placeholder: '请输入手机号',
                            clearable: true,
                            style: { width: '200px' },
                            value: ''
                        },
                        // {
                        //     id: 2,
                        //     key: "Select",
                        //     clearable: true,
                        //     placeholder: "线索状态",
                        //     style: { width: "100px" },
                        //     value: "",
                        //     childList: [],
                        //     callback: "change",
                        // },
                        {
                            id: 3,
                            key: 'Select',
                            clearable: true,
                            placeholder: '部门',
                            style: { width: '100px' },
                            value: '',
                            childList: [],
                            callback: 'changeAlias'
                        },
                        {
                            id: 11,
                            key: 'Select',
                            clearable: true,
                            placeholder: '设备别名',
                            style: { width: '200px' },
                            value: '',
                            childList: [],
                            callback: 'change',
                            show: {
                                key: false
                            }
                        },
                        {
                            id: 4,
                            key: 'Select',
                            clearable: true,
                            placeholder: '来电状态',
                            style: { width: '100px' },
                            value: '',
                            childList: [
                                { value: 1, label: '已接听' },
                                { value: 0, label: '未接听' }
                            ],
                            callback: 'change'
                        },
                        {
                            id: 6,
                            key: 'Select',
                            clearable: true,
                            placeholder: '联系人员',
                            style: { width: '100px' },
                            value: '',
                            childList: [],
                            callback: 'change'
                        },
                        {
                            id: 5,
                            key: 'DatePicker',
                            type: 'daterange',
                            options: {
                                disabledDate(date) {
                                    return date && date.valueOf() > Date.now();
                                }
                            },
                            placeholder: '请选择来电日期',
                            style: { width: '200px' },
                            value: [new Date(), new Date()],
                            callback: 'changetime'
                        },
                        {
                            id: 20,
                            key: 'slot',
                            keys: 'timeButton'
                        },
                        {
                            id: 21,
                            key: 'slot',
                            keys: 'checkbox'
                        }
                    ]
                },
                total: 0,
                DatePicker: new Date(new Date().getTime() + 86400000),
                DatePicker1: new Date(new Date().getTime()),
                optionss: {
                    disabledDate(date) {
                        return (
                            date && date.valueOf() < Date.now() - 24 * 3600 * 1000
                        );
                    }
                },
                pageOpts: [10, 15, 20, 30, 50],
                params1: {
                    id: undefined,
                    clue_status_id: '8',
                    remark: '',
                    day: 1,
                    bodyPart: [],
                    weChartNum: '',
                    mobile: '',
                    day1: 0,
                    userName: '',
                    contact_type: '',
                    age: null,
                    birthday: '',
                    sex: '',
                    city_id: '',
                    oneDiseases: '',
                    twoDiseases: '',
                    patientStatus: '2'
                },
                patientStatusArr: [],
                params: {
                    page: 1,
                    pageSize: 10,
                    mobile: '',
                    clue_status_id: '',
                    wechatid: '',
                    department_id: '',
                    is_call: '',
                    have_repeat: 0,
                    operation_id: '',
                    start_time: '',
                    end_time: ''
                },
                RadioGroup: [
                    { id: 0.5, name: '0.5' },
                    { id: 0.75, name: '0.75' },
                    { id: 1, name: '1.0' },
                    { id: 1.5, name: '1.5' },
                    { id: 1.75, name: '1.75' },
                    { id: 2, name: '2.0' }
                ],
                model1: 1,
                clueList: [],
                contactDatas: true,
                musicurl: '',
                repeatDataList: [],
                repeatInfo: {},
                patientStatus: false,// 是否老患者到诊状态
            };
        },
        mounted() {
            if(this.$route.path === '/business/newClue/newData') {
                for(let i = 0; i < this.columns.length; i++) {
                    if(this.columns[i].title == '联系人员') {
                        this.columns.splice(i, 1);
                    }
                }
                for(let i = 0; i < this.searchData.project.length; i++) {
                    if(this.searchData.project[i].placeholder == '联系人员') {
                        this.searchData.project.splice(i, 1);
                    }
                }
            }
             this.timeButtons(10);
            this.initial();
        },
        computed: {
            bodyPartRule() {
                if(this.params1.oneDiseases === '1') {
                    return {
                        required: true,
                        validator: (rule, value, callback) => {
                            if(value.length) {
                                callback();
                            }else {
                                callback(new Error('请选择部位'));
                            }
                        },
                        trigger: 'change'
                    };
                }else {
                    return {
                        required: false,
                        type: 'array',
                        trigger: 'change'
                    };
                }
            },
            remarkRule() {
                if(this.params1.clue_status_id === '8') {
                    return {
                        required: false,
                        type: 'string',
                        message: '请输入备注原因',
                        trigger: 'blur'
                    };
                }else {
                    return {
                        required: true,
                        type: 'string',
                        message: '请输入备注原因',
                        trigger: 'blur'
                    };
                }
            },
            twoRules() {
                if(this.diseasesArr2.length) {
                    return {
                        required: true,
                        message: '请选择二级病种',
                        trigger: 'change'
                    };
                }else {
                    return {
                        required: false,
                        message: '请选择二级病种',
                        trigger: 'change'
                    };
                }
            },
            birthdays() {
                if(this.params1.age !== '') {
                    var year = new Date().getFullYear() - this.params1.age;
                    return year + '-01' + '-01';
                }
            }
        },
        methods: {
            initials(menuName) {
                if(this.firstTime) {
                    if(this.booltimeButton) {
                        this.searchData.project.forEach(item => {
                            if(item.id === 5) {
                                item.value = [this.$Date().subtract(10, 'day'), this.$Date()];
                                this.params.start_time = item.value[0];
                                this.params.end_time = item.value[1];
                            }
                        });
                    }
                    if(this.columnsHeader == 1) {
                        let length = this.columns.length - 3;
                        let columnsing = { title: '联系次数', key: 'contact_count', minWidth: 168 };
                        this.columns.splice(length, 0, columnsing);
                    }
                    this.params.clue_status_id = this.clue_status_id;
                   
                    this.askData();
                    this.firstTime = false;
                }
            },
            timeButtons(num) {
                this.searchData.project.forEach(item => {
                    if(item.id === 5) {
                        item.value = [this.$Date().subtract(num, 'day'), this.$Date()];
                        this.params.start_time = item.value[0];
                        this.params.end_time = item.value[1];
                        this.timeButton = num;
                    }
                });
                this.askData();
            },
            cityvalue(city) {
                this.city_id = city;
                this.params1.city_id = city.join(',');
            },
            repeatData(data) {
                this.repeatDatas = true;
                this.callloading = true;
                repeatCallData({
                    id: data.id
                }).then(res => {
                    this.repeatDataList = res.list;
                    this.repeatInfo = res.info;
                    this.callloading = false;
                });
            },
            clearOne() {
                this.diseasesArr2 = [];
                this.params1.twoDiseases = '';
            },
            initial() {
                cluecallselectinfo().then(res => {
                    this.clueList = res.clue_status;
                    this.device = res.device;
                    this.searchData.project.forEach(item => {
                        if(item.id === 3) {
                            item.childList = res.department;
                        }else if(item.id === 6) {
                            item.childList = res.operation_member;
                        }
                    });
                });
            },
            askData() {
                let params = {
                    page: this.params.page ? this.params.page : 1,
                    pageSize: this.params.pageSize ? this.params.pageSize : 10,
                    mobile: this.params.mobile ? this.params.mobile : '',
                    clue_status_id: this.params.clue_status_id ? this.params.clue_status_id : '',
                    wechatid: this.params.wechatid ? this.params.wechatid : '',
                    department_id: this.params.department_id ? this.params.department_id : '',
                    is_call: this.params.is_call ? this.params.is_call : this.params.is_call === 0 ? 0 : '',
                    have_repeat: this.params.have_repeat ? this.params.have_repeat : 0,
                    operation_id: this.params.operation_id ? this.params.operation_id : '',
                    start_time: this.params.start_time ? this.params.start_time : '',
                    end_time: this.params.end_time ? this.params.end_time : ''
                };
                cluecalllist(params).then(res => {
                    this.list = Object.freeze(res.list);
                    this.total = res.total;
                    let params = { key: 'call', total: res.total };
                    this.$emit('returntotal', params);
                });
            },
            changeAlias(value) {
                this.params.wechatid = '';
                if(value) {
                    let childLis = this.device
                        .filter(ee => {
                            return ee.did === value; 
                        })
                        .map(eee => {
                            return {
                                ...eee,
                                value: eee.wechatid,
                                label: eee.nickname
                            };
                        });
                    this.searchData.project.forEach(item => {
                        if(item.id === 11) {
                            item.value = '';
                            // if (childLis.length) {
                            item.show['key'] = true;
                            item.childList = childLis;
                            // } else {
                            // item.show["key"] = false;
                            // item.childList = [];
                            this.askDatachanges();
                            // }
                        }
                    });
                }else {
                    this.searchData.project.forEach(item => {
                        if(item.id === 11) {
                            item.show['key'] = false;
                            item.childList = [];
                            if(!item.value || item.value === undefined) {
                                this.askDatachanges();
                            }else {
                                item.value = '';
                            }
                        }
                    });
                }
            },
            /* @函数功能: 分页 */
            changepage(e) {
                this.params.page = e;
                this.askData();
            },
            /* @函数功能: 每页数量 */
            changepageSize(e) {
                this.params.pageSize = e;
                this.askData();
            },
            changeclue(e) {
                for(let item of this.clueList) {
                    if(e === item.value) {
                        if(+item.value === 8) this.contactDatas = true;
                        else this.contactDatas = false;
                    }
                }
            },
            changeOne(value) {
                if(value) {
                    this.diseasesArr2 = this.diseasesArr1.filter(
                        ee => {
                            return ee.value == value; 
                        }
                    )[0].children;
                    this.params1.twoDiseases = '';
                    if(!this.diseasesArr2.length) {
                        this.$nextTick(() => {
                            this.$refs.formItem.validateField('twoDiseases');
                        });
                    }
                }
            },
            askDatasearch() {
                this.timeButton = null;
                this.searchData.project.forEach(item => {
                    if(item.key === 'Input') {
                        this.params.mobile = item.value;
                        if(item.value !== '') {
                            this.searchData.project.forEach(items => {
                                if(items.key === 'DatePicker') {
                                    if(
                                        JSON.stringify(items.value) !==
                                        JSON.stringify(['', ''])
                                    ) {
                                        let timer = [
                                            this.$Date(items.value[0]).format(
                                                'YYYY-MM-DD'
                                            ),
                                            this.$Date(items.value[1]).format(
                                                'YYYY-MM-DD'
                                            )
                                        ];
                                        this.storage.set('clue-call', timer);
                                        items.value = ['', ''];
                                        this.params.start_time = '';
                                        this.params.end_time = '';
                                    }
                                }
                            });
                        }else {
                            this.searchData.project.forEach(items => {
                                if(items.key === 'DatePicker') {
                                    if(
                                        JSON.stringify(
                                            this.storage.get('clue-call')
                                        ) !== JSON.stringify(['', ''])
                                    ) {
                                        items.value = this.storage.get('clue-call');
                                        this.params.start_time = items.value[0];
                                        this.params.end_time = items.value[1];
                                    }
                                }
                            });
                        }
                    }
                });
                this.params.page = 1;
                this.params.pageSize = 15;
                this.params.department_id = '';
                this.params.is_call = '';
                this.params.operation_id = '';
                this.params.wechatid = '';
                this.askData();
            },
            askDatachanges() {
                this.params.page = 1;
                this.searchData.project.forEach(item => {
                    if(item.id === 3) {
                        this.params.department_id = item.value;
                    }else if(item.id === 4) {
                        this.params.is_call = item.value;
                    }else if(item.id === 5) {
                        this.params.start_time = item.value[0];
                        this.params.end_time = item.value[1];
                        let timer = ['', ''];
                        if(
                            JSON.stringify(item.value) !== JSON.stringify(['', ''])
                        ) {
                            timer = [
                                this.$Date(item.value[0]).format('YYYY-MM-DD'),
                                this.$Date(item.value[1]).format('YYYY-MM-DD')
                            ];
                        }
                        this.storage.set('clue-call', timer);
                    }else if(item.id === 6) {
                        this.params.operation_id = item.value;
                    }else if(item.id === 11) {
                        this.params.wechatid = item.value;
                    }
                });
                this.askData();
            },
            askDatachangestime() {
                this.timeButton = null;
                this.askDatachanges();
            },
            // 听录音
            handleSound(row) {
                this.musicurl = row.record_url;
                this.sound = true;
            },
            telrepeat(data) {
                let config = {
                    id: this.params1.id === undefined ? 0 : this.params1.id,
                    mobile: data
                };
                patientindexsearchmobile(config).then(res => {
                    if(+res.result === 1) {
                        this.$Message.error({
                            duration: 2.5,
                            content: '该手机号码已存在'
                        }
                        );
                    }
                });
                repeatbaiyou({mobile: data}).then(res => {
                    // console.log(res,'res')
                    this.patientStatus = res;
                });
            },
            WXrepeat(data) {
                let config = {
                    id: this.params1.id === undefined ? 0 : this.params1.id,
                    wechat_id: data
                };

                patientindexsearchmobile(config).then(res => {
                    if(+res.result === 2) {
                        this.$Message.error({
                            duration: 2.5,
                            content: '该微信号已存在'
                        }
                        );
                    }
                });
            },
            // 联系线索客户
            handleContactClue(row) {
                if(+row.clue_status_id !== 8) this.contactshow = true;
                else this.contactshow = false;
                this.$refs.formItem.resetFields();
                this.cityshow = false,
                getCluecallcontact({ id: row.id }).then(res => {
                    if(
                        res.default_city &&
                        JSON.stringify(res.default_city) !== '{}'
                    ) {
                        this.optionscity = [
                            {
                                value: res.default_city.city_id,
                                label: res.default_city.city_name
                            }
                        ];
                        // this.params1.city = res.default_city.city_id;
                        this.params1.city_id = [];
                        this.cityshow = true;
                    }
                    this.createData = {
                        gender: res.info.gender,
                        age: res.info.age,
                        wechat_id: res.info.wechat_id,
                        parts_name: res.info.parts_name,
                        city_name: res.info.city_name,
                        mobile: res.info.mobile,
                        customer_remark: res.info.customer_remark,
                        is_add: res.info.is_add
                    },
                    this.logs(row.info);
                    this.contact = res.contact;
                    this.postList = res.body_parts_list;
                    this.diseasesArr1 = res.diseases;
                    this.patientStatusArr = res.patient_status;
                });
                this.contactClue = true;
                this.params1.id = row.id;
                this.params1.mobile = row.called_tel;
                this.params1.patientStatus = '2';
                this.params1.city = [];
            },
            handleDrawerCancel(name) {
                this.city_id = [];
                this.$refs[name].resetFields();
                this.contactClue = false;
                this.params1 = {
                    id: undefined,
                    clue_status_id: '8',
                    remark: '',
                    day: 1,
                    day1: 0,
                    userName: '',
                    weChartNum: '',
                    mobile: '',
                    contact_type: '',
                    age: null,
                    birthday: '',
                    sex: '',
                    city_id: '',
                    oneDiseases: '',
                    twoDiseases: '',
                    patientStatus: '2'
                };
                this.diseasesArr2 = [];
                this.diseasesArr1 = [];
            },
            // 搜索手机号
            handlesearch(name) {
                this.$refs[name].validate(valid => {
                    if(valid) {
                        if(this.params1.clue_status_id === '8') {
                            let config = {
                                id: this.params1.id === undefined ? 0 : this.params1.id,
                                mobile: this.params1.mobile,
                                wechat_id: this.params1.weChartNum
                            };
                            patientindexsearchmobile(config).then(res => {
                                if(+res.result === 1) {
                                    this.$Modal.confirm({
                                        title: '提示',
                                        content: '<p>该手机号码已存在，是否继续录入?</p>',
                                        onOk: () => {
                                            this.handleSubmit();
                                        },
                                        onCancel: () => {
                                            this.remarksloading = false;
                                        }
                                    });
                                }else if(+res.result === 2) {
                                    this.$Modal.confirm({
                                        title: '提示',
                                        content: '<p>该微信号已存在，是否继续录入?</p>',
                                        onOk: () => {
                                            this.handleSubmit();
                                        },
                                        onCancel: () => {
                                            this.remarksloading = false;
                                        }
                                    });
                                }else if(+res.result === 3) {
                                    this.$Modal.confirm({
                                        title: '提示',
                                        content: '<p>该手机号/微信号已存在，是否继续录入?</p>',
                                        onOk: () => {
                                            this.handleSubmit();
                                        },
                                        onCancel: () => {
                                            this.remarksloading = false;
                                        }
                                    });
                                }else {
                                    this.handleSubmit();
                                }
                            });
                        }else {
                            this.handleSubmit();
                        }
                    }
                });
            },
            handleSubmit(name) {
                let params = {
                    id: this.params1.id,
                    clue_status_id: this.params1.clue_status_id,
                    remark:
                        this.params1.clue_status_id === '8'
                            ? ''
                            : this.params1.remark,
                    day:
                        this.params1.clue_status_id === '8' &&
                        (this.params1.patientStatus === '2' ||
                        this.params1.patientStatus === '1')
                            ? parseInt(
                                new Date(this.DatePicker).getTime() / 1000
                            )
                            : '',
                    type: 3,
                    patient_status_id:
                        this.params1.clue_status_id === '8'
                            ? this.params1.patientStatus
                            : '',
                    user_name:
                        this.params1.clue_status_id === '8'
                            ? this.params1.userName
                            : '',
                    age:
                        this.params1.clue_status_id === '8'
                            ? this.params1.age
                            : '',
                    birthday:
                        this.params1.clue_status_id === '8'
                            ? this.birthdays
                            : '',
                    patient_diseases_id:
                        this.params1.clue_status_id === '8'
                            ? this.params1.oneDiseases
                            : '',
                    patient_diseases_child_id:
                        this.params1.clue_status_id === '8'
                            ? this.params1.twoDiseases
                            : '',
                    patient_remake:
                        this.params1.clue_status_id === '8'
                            ? this.params1.remark
                            : '',
                    city_id: this.params1.clue_status_id === '8' ? this.params1.city_id : '',
                    appointment_day:
                        this.params1.clue_status_id === '8' &&
                        this.params1.patientStatus === '1'
                            ? parseInt(
                                new Date(this.DatePicker1).getTime() /
                                    1000
                            )
                            : '',
                    gender:
                        this.params1.clue_status_id === '8'
                            ? this.params1.sex
                            : '',
                    // city_name: this.params1.city
                    //     ? this.optionscity.filter(
                    //         (ee) => ee.value === this.params1.city
                    //     )[0].label
                    //     : "",
                    wechat_id:
                        this.params1.clue_status_id === '8'
                            ? this.params1.weChartNum
                            : '',
                    mobile:
                        this.params1.clue_status_id === '8'
                            ? this.params1.mobile
                            : '',
                    body_parts_id: this.params1.clue_status_id === '8'
                        ? this.params1.bodyPart.join(',')
                        : '',
                    contact_type: this.params1.clue_status_id == 7 ? this.params1.contact_type : ''
                };
                this.remarksloading = true;
                cluecallcontact(params)
                    .then(() => {
                        this.city_id = [];
                        this.remarksloading = false;
                        this.askData();
                        this.$Message.success('联系成功!');
                        this.contactClue = false;
                        this.diseasesArr2 = [];
                        this.params1 = {
                            id: undefined,
                            clue_status_id: '8',
                            remark: '',
                            day: 1,
                            day1: 0,
                            bodyPart: [],
                            userName: '',
                            weChartNum: '',
                            mobile: '',
                            age: null,
                            birthday: '',
                            sex: '',
                            city_id: '',
                            oneDiseases: '',
                            twoDiseases: '',
                            patientStatus: '2'
                        };
                        this.$refs.formItem.resetFields();
                    })
                    .catch(() => {
                        this.remarksloading = false;
                });
            },
            blurday(num) {
                this.DatePicker = this.$blurday(num);
            },
            changeday(date) {
                this.params1.day = this.$changeday(date);
            },
            getDatas: lodash.debounce(function(params) {
                if(this.optionscity.every(ee => {
                    return ee.label !== params; 
                })) {
                    this.loadingcity = true;
                    patientindexsearchcity({
                        keywords: params
                    }).then(res => {
                        this.$nextTick(() => {
                            this.loadingcity = false;
                            this.optionscity = Object.freeze(
                                res.list.map(ee => {
                                    return {
                                        value: ee.value + ',' + params,
                                        label: ee.label
                                    };
                                })
                            );
                            // this.$refs.citySearch.isFocused = false;
                        });
                    });
                }
            }, 700),
            remoteMethod(query) {
                if(query !== '') {
                    this.getDatas(query);
                }else {
                    this.optionscity = [];
                }
            },
            blurday1(num) {
                this.DatePicker1 = this.$blurday(num);
            },
            changeday1(date) {
                this.params1.day1 = this.$changeday(date);
            },
            cancel() {
                const audio = document.getElementById('audio');
                if(this.musicurl !== '') {
                    audio.pause();
                }
                this.musicurl = '';
                this.model1 = 1;
            },
            changeaudio(model1) {
                const audio = document.getElementById('audio');
                audio.playbackRate = model1;
            },
            checkbox3(e) {
                this.params.page = 1;
                this.params.have_repeat = e.length;
                this.searchData.project.forEach(item => {
                    if(item.id === 4) {
                        item.value = [];
                        this.timeButton = null;
                        this.params.start_time = item.value[0];
                        this.params.end_time = item.value[1];
                    }
                });
                this.askData();
            },
            checkbox5(e) {
                this.params.page = 1;
                this.params.clue_status_id = e.length ? 28 : this.clue_status_id;
                this.searchData.project.forEach(item => {
                    if(item.id === 5) {
                        item.value = [];
                        this.timeButton = null;
                        this.params.start_time = item.value[0];
                        this.params.end_time = item.value[1];
                    }
                });
                this.askData();
            }
        }
    };
</script>
<style scoped>
/deep/.ivu-modal-mask{
    z-index: 1000 !important;
}
/deep/ .ivu-modal-wrap{
    z-index: 1000 !important;
}
    .person {
        color: #999;
    }

    .repeatColor {
        color: red;
    }
</style>
